
CSS is incredibly powerful. By way of introducing this course, I took the Google homepage and changed the look and feel using CSS and a free browser plugin.
This lecture shows you the tools you'll need to install before we move on with the course.
Don't worry what that title means, we're simply going to look at the construction of valid CSS code.
CSS stands for Cascading Style Sheets, but what does the cascading bit mean?
There are three ways we can insert CSS into a page. The first one, called Inline Styles are explored in this video.
The second way of inserting CSS into a web page is with internal CSS. This video looks at Internal CSS:
External Style sheets are the third option. This video looks at how we use them and why they are the best option for most situations.
There are a few ways we can specify a color in CSS. This tutorial looks at them, and where yo find help if you need it.
Here are some examples of using color in CSS code
Color is extremely important in web design. This resource file provides you with links to desktop color pickers that allow you to capture any color on your computer monitor, and online color pickers to help you choose colour schemes for your site.
This lecture looks at the background color of a webpage, but also how to use images in the background.
Length is a numerical value plus a unit, but length can be an absolute or relative measurements. This lecture looks at the diffference.
Let's look at some examples of using the units in CSS.
This lecture looks at font-families, what they are and how you can play around with them on a live website (even if you do not own that website).
In this lecture, we'll look at some other font and text properties that can change the look of the text on a web page.
Without links, the Internet would not work. This lecture looks at how we can format the links on our webpages.
Let's start with a brief refresher on the HTML code used to create lists.
Now let's see how we can control these lists with CSS.
CSS gives us classes and IDs so we can create our own selectors.
The box model in CSS is important to understand because all elements on an HTML page are inside boxes, whether you can see the box or not.
Divisions, or DIVs for short, allow us to define areas of the page to treat as a single unit.
The float property allows us to float boxes to the left or right. When you float a box, the rest of the web page content will flow around it.
An overview of how we can change or add CSS in WordPress.
A look at the theme file editor and how to use it. We'll talk about the advantages and disadvantages of this approach.
We'll look at the pros and cons of using the Additional CSS option for both older themes and the new block themes.
How to modify block appearance using CSS.
You may want to add custom CSS to a single post or page. Using a plugin, we can easily do that.
This video looks at hiding an element on the web page using the Display property.
This video looks at changing the CSS in Astra to remove that large gap between header and opening headline.
This video shows the solution to a problem that a student sent in. The CSS published on another site for changing the background of a web page didn't work as expected.
If you've ever wanted to add your own personal touch to a website but felt a little overwhelmed by CSS, you’re not alone. CSS can seem tricky at first, but it doesn’t have to be. That’s where the CSS for Beginners course comes in.
Think of it as your friendly guide to making your website look exactly the way you want it to. You’ll start by dipping your toes into the basics—like customizing your own version of Google’s homepage. It’s a fun, hands-on way to get comfortable with CSS right from the start.
Once you’ve got the hang of a few simple concepts, we’ll move on to the good stuff—like learning three different ways to add CSS to your pages. You’ll see how to use colors creatively, whether you’re looking for classic web-safe shades or something a bit more vibrant.
We’ll also dive into how to style specific elements, like headers and lists, using base selectors. Then, we’ll crank things up a notch with Classes and IDs, giving you the power to take your designs to the next level.
One of the most confusing parts of CSS for beginners is the Box Model—but don’t worry, we’ll break it down with simple diagrams and real-world examples. You’ll get to experiment with the code alongside me, using free tools that make the learning process fun and interactive.
If you’ve ever struggled with CSS or just want a gentle introduction, this course is perfect for you. It’s all about making learning enjoyable and accessible. Plus, you can check out the first lecture for free—no strings attached.
Let’s make your website look just the way you’ve imagined. See you in the course!